<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>移动家庭能力开放平台 Authorization 生成器</title>
</head>
<style>
	h1 {
		text-align: center;
		color: #4ECB9F;
		margin-bottom: 20px;
	}
	h3{
		float: right;
	}
	h3 a{
		text-decoration-line: none;
		color: blue;
	}
	span{
		color: #4ECB9F;
		font-size: 20px;
	}
	.content {
		text-align: center;
	}
	.content input {
		width: 100%;
		height: 40px;
		font-size: 16px;
		text-align: center;
		margin-bottom: 20px;
	}
	#secreBtn,
	#remBtn {
		width: 30%;
		height: 40px;
		background: #4ECB9F;
		color: #fff;
		border: 0;
	}
	#remBtn{
		width: 20%;
	}
	#result {
		width: 50%;
		height: 55px;
		margin-top: 20px;
		font-size: 16px;
		resize:none;
	}
</style>
<body>
	<h1>移动家庭能力开放平台 Authorization 生成器</h1>
	<div class="content">
		<span>apikey</span>
		<input type="text" id="apikey" placeholder="apikey">
		<span>secretKey</span>
		<input type="text" id="secretKey" placeholder="secretKey">
		<button type="button" id="secreBtn">加密</button>
		<button type="button" id="remBtn">记住</button>
		<br>
		<textarea id="result" rows="30" cols="30"></textarea> 	
	</div>
	<h3>Power by <a href="http://www.jianshu.com/u/5bbe008f9b84">ZZES-klren</a></h3>
	<script src="md5.js"></script>
	<script src="jbase64.js"></script>
	<script type="text/javascript" src="alphabet.min.js"></script>
	<script>
		var apikey = document.getElementById('apikey');
		var secretKey = document.getElementById('secretKey');
		var secreBtn = document.getElementById('secreBtn');
		var result = document.getElementById('result');
		var remBtn = document.getElementById('remBtn');
		var md5str;
		var jsonstr;
		apikey.value = localStorage.getItem("apikey");
		secretKey.value = localStorage.getItem("secretKey");
		secreBtn.onclick=function(){
			var timestemp = new Date().getTime();
			var str = apikey.value+secretKey.value+timestemp;
			console.log("拼接后字符串：" + str);
			console.log("md5加密后字符串：" + hex_md5(str));
			md5str = hex_md5(str);
			jsonstr = '{"apiKey": "'+apikey.value+'","time": "'+timestemp+'","sign":"'+ md5str+'"}';
			console.log(BASE64.encoder(jsonstr));
			result.innerHTML= BASE64.encoder(jsonstr);
		}
		if (!localStorage.getItem("apikey")) {
				remBtn.disable = false;
				remBtn.style.backgroundColor = "#4ECB9F";
		}else{
			remBtn.style.backgroundColor = "#E0E1E1";
		}
		remBtn.onclick = function(){
			localStorage.setItem("apikey",apikey.value);
			localStorage.setItem("secretKey",secretKey.value);
			remBtn.style.backgroundColor = "#E0E1E1";

		}
		 console.log(Alphabet('ZZESKLREN','planar'));
		 console.log("风里雨里，简书等你，http://www.jianshu.com/u/5bbe008f9b84")
		
	</script>
</body>
</html>

